<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<style>
    .mian{
        background-color: bisque(255, 0, 191);
    }
    .ye{
        width: 700px;
        position: relative;
        left: 300px;
        background-color: bisque;
    }
    .dingbu{
        height: 35px;
        background-color: black;

    }
    a{
        color: #fdfafa;
        text-decoration: none;
        position: relative;
        left: 600px;
        top: 5px;
       
    }
    
    .d1{
        position: relative;
        left: 30px;
    }
    .d2{
        position: relative;
        left: 60px;
    }
    .d3{
        position: relative;
        left: 90px;
    }
    .d4{
        position: relative;
        left: 120px;
    }
    .tp1{
       
        position: relative;
        top: 10px;
        left: 50px;
        border-radius: 5px;
    }
    h3{
        text-align: center;
      
    }
    .tp2{
        width: 250px;
        position: relative;
        left: 405px;
        border-radius: 10px 0px;
    }
    .ziti{
        width:300px;
        height: 200px;
       
        position: relative;
        bottom: 400px;
        left: 50px;
    }
    .ziti2{
        position: relative;
        bottom: 210px;
    }
    .tp3{
        position: relative;
        left: 40px;
        height: 420px;

    }
  
    .juesi1{
        width: 120px;
        border-radius: 100%;
        position: relative;
        bottom: 200px;
        left: 20px;
    }
    .juesi1:hover{
            transform: scale(1.3);
    }
    .juesi2{
        width: 130px;
        border-radius: 100%;
        position: relative;
        bottom: 200px;
        left: 40px;
        right: 20px;
    }
    .juesi2:hover{
            transform:scale(1.3)
    }
    .juesi3{
        width: 120px;
        border-radius: 100%;
        position: relative;
        bottom: 202px;
        left: 60px; 
    }
    .juesi3:hover{
            transform: scale(1.3);
    }
    .juesi4{
        width: 120px;
        border-radius: 100%;
        position: relative;
        bottom: 205px;
        left: 80px;
        margin-top: 20px; 
    }
    .juesi4:hover{
            transform: scale(1.3);
    }
    .no1{
        position: relative;
        bottom: 200px;
        left: 35px;
       
    }
    .no2{
        position: relative;
        bottom: 238px;
        left: 180px;
    }
    .no3{
        position: relative;
        bottom: 275px;
        left:335px;
    }
    .no4{
        position: relative;
        bottom: 311px;
        left: 475px;
    }
    .tupian{
       width: 650px;
        position: relative;
        bottom: 300px;
        right: 15px;
        border-radius: 5px;
    }
</style>
<body>
        <div class="dingbu">
            <a href="" >首页</a>
            <a href="../daima/02.html"><span class="d1">角色介绍</span></a>
            <a href="../daima/03.html"><span class="d2">彩色图集</span></a>
            <a href="../daima/04.html"><span class="d3">登录</span></a>
            <a href="../daima/05.html"><span class="d4">注册</span></a>
        </div>   
<div class="mian">     
    <div class="ye">    
        
        <div >
            <img class="tp1" src="../tupian/01.webp" alt="图片">
        </div>
            <div><h3>画-江-湖-之-不-良-人</h3></div>
        <div>
            <img class="tp2" src="../tupian/02.jpg" alt="图片">
                <div class="ziti">
                    <p>   《画江湖之不良人》是北京若森数字科技有限公司继《侠岚》在获取了巨大的市场成功之后出品的大型三维玄幻武侠动画《画江湖之不良人》系列。<br>
                        该动画围绕唐代从事侦缉捕盗职务的官差“不良人”这个组织所隐匿起来的太宗龙泉宝藏而展开。群雄侠隐仗剑、江湖乱世情爱，谱写浪漫辉煌的中国经典历史传奇。
                        <br>2023年5月,官方在《画江湖之不良人6》完结后紧接播出了第七季的先导PV,同年8月,画江湖之不良人官方发布了《画江湖之不良人7》的预告片。</p>
                </div>
        </div>
            <div class="ziti2"><h3>主-要-角-色</h3></div>
            <div class="tp3">
                <img class="juesi1" src="../tupian/03.jpg" alt="图片">  
                <img class="juesi2" src="../tupian/04.jpg" alt="图片">                      
                <img class="juesi3" src="../tupian/06.jpg" alt="图片">                      
                <img class="juesi4" src="../tupian/05.jpg" alt="图片">
                <div class="no1"><p>NO.1 李星云</p></div>
                <div class="no2"><p>NO.2 袁天罡</p></div>
                <div class="no3"><p>NO.3 姬如雪</p></div>
                <div class="no4"><p>NO.4 张子凡</p></div>
                <div><img class="tupian" src="../tupian/07.jpg" alt="图片"></div>
            </div>
    </div>
</div>
</body>
</html>